/*
This Source Code Form is subject to the terms of the Mozilla Public
License, v. 2.0. If a copy of the MPL was not distributed with this
file, You can obtain one at http://mozilla.org/MPL/2.0/.

Copyright (c) 2023-present Kaleidos INC
*/
@import url("tools/typography.css");

:host {
  @mixin font-inline;

  background-color: var(--badge-background, --color-gray10);
  border-radius: 3px;
  color: var(--badge-color, --color-gray80);
  display: block;
  font-style: italic;
}

.badge {
  align-items: center;
  block-size: min-content;
  display: flex;
  gap: var(--spacing-4);
  line-height: 1.25;
  padding-inline: var(--spacing-8);
}

/* Sizes */

.badge[data-size="s"] {
  @mixin font-small;

  font-style: normal;
  padding-block: var(--spacing-2);
}

.badge[data-size="m"] {
  padding-block: var(--spacing-4);
}

.badge[data-size="l"] {
  padding-block: var(--spacing-8);
}

.badge-label {
  @mixin ellipsis;

  display: block;
  min-inline-size: 0;
}

.badge-icon {
  block-size: var(--spacing-16);
  color: var(--badge-icon, --color-gray80);
  inline-size: var(--spacing-16);
}
